import React, { useEffect } from 'react';
import { getFindByParentIdAsync, useSelectorDict } from "@/store/slices/dict";
import { useAppDispatch } from "@/hooks";
import { Table } from "antd";

function Dict() {
    const dispatch = useAppDispatch();
    const { dictList, loading } = useSelectorDict();
    useEffect(() => {
        dispatch(getFindByParentIdAsync(1));
    }, []);
    return (
        <div id="content">
            <Table
                // 加载中
                loading={loading}
                expandable={{
                    // 点击展开图标时触发
                    onExpand(expanded, record) {
                        // expanded:是否展开
                        if (expanded) {
                            // console.log(record.id);
                            dispatch(getFindByParentIdAsync(record.id));
                        }
                    }
                }}
                // 不需要分页
                pagination={false}
                // 列信息
                columns={[
                    {
                        title: "名称",
                        dataIndex: "name"
                    },
                    {
                        title: "编码",
                        dataIndex: "dictCode"
                    },
                    {
                        title: "值",
                        dataIndex: "value"
                    },
                    {
                        title: "创建时间",
                        dataIndex: "createTime"
                    }
                ]}
                // 数组元素中的id属性值作为标识
                rowKey={"id"}
                // 数据源(数组）
                dataSource={dictList}
            ></Table>
        </div>
    );
}

export default Dict;